<template>
  <div class="spl-container emp-baseSetting-container">
    <breadcrumb :data="pathData"></breadcrumb>
    <div class="emp-title">
      <p class="text-blue font-14">基础设置：</p>
      <p>为了便于人员档案管理，员工属性字段分为“个人基础信息”、“教育经历”、“工作经历”、“在职信息”、“账户信息”、“合同信息”、“资料信息”。</p>
      <p>系统默认的分类和属性字段无法被删除或者修改，如果您的企业需要增加自定义，可以在对应的分类下添加。</p>
    </div>

    <div class="emp-tabs m-form">

      <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
        <el-tab-pane label="个人基本情况" name="baseInfo"></el-tab-pane>
        <el-tab-pane label="在职信息" name="workInfo"></el-tab-pane>
        <el-tab-pane label="账户信息" name="accountInfo"></el-tab-pane>
        <el-tab-pane label="合同信息" name="contractInfo"></el-tab-pane>
      </el-tabs>

      <div class="table-content">
        <div class="clearfix">
          <el-button type="text" class="fr add-field-btn" @click="toAddDataForm"><i
            class="ic-circle-plus el-icon-circle-plus-outline"></i>添加属性字段
          </el-button>
        </div>
        <p v-if="activeName=='accountInfo'">银行卡信息</p>
        <com-table :tableData="tableData" :paging="false" ref="comTable" class="mt-0"
                   :tableHeight="(activeName=='accountInfo')?(tableHeight-200)/2+'px':(tableHeight-60)+'px'">
          <el-table-column prop="formName" label="字段名称">
            <template slot-scope="scope">
              <p>{{ scope.row.formName }}
                <el-tag size="mini" v-if="scope.row.tentId!='000000'">自定义</el-tag>
              </p>
            </template>
          </el-table-column>
          <el-table-column prop="formDesc" label="字段描述"></el-table-column>
          <el-table-column prop="required" label="是否必填" :formatter="formatterText"></el-table-column>
          <el-table-column prop="effective" label="是否有效">
            <template slot-scope="scope">
              <span v-if="scope.row.tentId=='000000'" v-text="scope.row.effective?'是':'否'"></span>
              <el-switch v-if="scope.row.tentId!='000000'" :value="scope.row.effective" dis :active-value="true"
                         :inactive-value="false"
                         :activeColor="$global.switchColor[0]" :inactiveColor="$global.switchColor[1]"
                         @change="clickSwitch($event,scope.row)">
              </el-switch>
            </template>
          </el-table-column>
          <el-table-column prop="formType" label="字段类型"></el-table-column>
          <el-table-column prop="otherRequired" label="入职配置是否有效" :formatter="formatterText"></el-table-column>
          <el-table-column fixed="right" label="操作" width="180">
            <template slot-scope="scope">
              <div class="table-operate-btns">
                <el-button type="text" icon="el-icon-edit" class="btn edit-btn" @click="rowClick(scope.row)" v-if="scope.row.tentId!='000000'">编辑</el-button>
                <el-button type="text" icon="el-icon-delete" class="btn del-btn ml-20" v-if="scope.row.tentId!='000000'" @click="delRow(scope.row)">删除</el-button>
              </div>
            </template>
          </el-table-column>
        </com-table>

        <p v-if="activeName=='accountInfo'" class="pt-30">福利信息</p>
        <com-table :tableData="welfareTableData" :paging="false" ref="welfareTable"
                   :tableHeight="(activeName=='accountInfo')?(tableHeight-150)/2+'px':tableHeight+'px'"
                   v-if="activeName=='accountInfo'">
          <el-table-column prop="formName" label="字段名称">
            <template slot-scope="scope">
              <p>{{ scope.row.formName }}
                <el-tag size="mini" v-if="scope.row.tentId!='000000'">自定义</el-tag>
              </p>
            </template>
          </el-table-column>
          <el-table-column prop="formDesc" label="字段描述"></el-table-column>
          <el-table-column prop="required" label="是否必填" :formatter="formatterText"></el-table-column>
          <el-table-column prop="effective" label="是否有效">
            <template slot-scope="scope">
              <span v-if="scope.row.tentId=='000000'" v-text="scope.row.effective?'是':'否'"></span>
              <el-switch v-if="scope.row.tentId!='000000'" :value="scope.row.effective" dis :active-value="true"
                         :inactive-value="false"
                         :activeColor="$global.switchColor[0]" :inactiveColor="$global.switchColor[1]">
              </el-switch>
            </template>
          </el-table-column>
          <el-table-column prop="formType" label="字段类型"></el-table-column>
          <el-table-column prop="otherRequired" label="入职配置是否有效" :formatter="formatterText"></el-table-column>
          <el-table-column fixed="right" label="操作" width="180">
            <template slot-scope="scope">
              <div class="table-operate-btns">
                <el-button type="text" icon="el-icon-edit" class="btn edit-btn" @click="rowClick(scope.row)" v-if="scope.row.tentId!='000000'">编辑</el-button>
                <el-button type="text" icon="el-icon-delete" class="btn del-btn ml-20" v-if="scope.row.tentId!='000000'" @click="delRow(scope.row)">删除</el-button>
              </div>
            </template>
          </el-table-column>
        </com-table>
      </div>

    </div>
    <el-dialog title="添加属性字段" class="spl-dialog addDialog" :visible.sync="dialogFormAddVisible" center
               :closeOnClickModal="false" :before-close="clearAddField">
      <el-form :model="addDataForm" ref="ruleFormAdd" label-width="120px" class="demo-ruleForm">
        <el-row :gutter="20">
          <el-col :span="11">
            <!--<el-form-item label="所属分类:" required prop="moduleName" :rules="[{ required: true, message: '请选择所属分类'}]">-->
            <!--<treeSelect :options="typeTreeData" :value="addDataForm.moduleName" v-model="addDataForm.moduleName"></treeSelect>-->
            <!--</el-form-item>-->
            <el-form-item label="所属分类:" required>
              <treeSelect :options="typeTreeData" :clearable="false" @getNodeValue="getNodeValue" :value="addDataForm.subModuleCode==null?addDataForm.moduleCode:addDataForm.subModuleCode"></treeSelect>
            </el-form-item>
          </el-col>
          <el-col :span="13">
            <el-form-item label="是否有效:" required>
              <el-switch v-model="addDataForm.effective" :active-value="true" :inactive-value="false"
                         :activeColor="$global.switchColor[0]" :inactiveColor="$global.switchColor[1]">
              </el-switch>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="11">
            <el-form-item label="字段名称:" prop="formName" :rules="[{ required: true, message: '请填写字段名称'},{validator:this.validFormName,trigger:'blur'}]">
              <el-input v-model="addDataForm.formName" placeholder="请输入"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="13">
            <el-form-item label="字段类型:" prop="formTypeCode" :rules="[{ required: true, message: '请选择字段类型'}]">
              <el-select v-model="addDataForm.formTypeCode" ref="addFormTypeCode" placeholder="请选择"
                         @change="changeFormType($event,1)">
                <el-option v-for="(item,index) in formTypeList" :label="item.text" :value="item.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20" v-if="addDataForm.formTypeCode==6" v-for="(item ,index) in addDataForm.selections" :key="index">
          <el-col :span="11">
            <el-form-item :label="index==0?'对应选项:':''" :prop="'selections.' + index + '.text'" :rules="{ required: true, message: '请输入选项值'}">
              <el-input v-model="item.text" placeholder="20个字符以内" maxlength="20"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="3" v-if="index!=0" class="pt-10">
            <el-link @click="addDataForm.selections.splice(index,1)" type="primary" class="text-red-imp">
              删除
            </el-link>
          </el-col>
          <el-col :span="13" v-if="index==0">
            <el-button type="text" class="add-field-btn" @click="addOption"><i
              class="ic-circle-plus el-icon-circle-plus-outline"></i>添加更多选项
            </el-button>
          </el-col>
        </el-row>
        <el-row :gutter="20" v-if="addDataForm.formTypeCode==1">
          <el-col :span="11">
            <el-form-item label="字段长度:">
              <el-input v-model="addDataForm.maximum" placeholder="请输入，默认0-300个字符"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20" v-if="addDataForm.formTypeCode==2">
          <el-col :span="11">
            <el-form-item label="默认值:">
              <el-input v-model="addDataForm.defaultValue" placeholder="请输入数字" type="number"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20" v-if="addDataForm.formTypeCode==8">
          <el-col :span="11">
            <el-form-item label="默认值:">
              <el-radio-group v-model="addDataForm.defaultValue">
                <el-radio label="1">是</el-radio>
                <el-radio label="0">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="11">
            <el-form-item label="是否必填:" required>
              <el-switch v-model="addDataForm.required" :active-value="true" :inactive-value="false"
                         :activeColor="$global.switchColor[0]" :inactiveColor="$global.switchColor[1]">
              </el-switch>
            </el-form-item>
          </el-col>
          <el-col :span="13">
            <el-form-item label="入职配置是否有效:" required>
              <el-switch v-model="addDataForm.otherRequired" :active-value="'1'" :inactive-value="'0'"
                         :activeColor="$global.switchColor[0]" :inactiveColor="$global.switchColor[1]">
              </el-switch>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="字段描述:">
              <el-input type="textarea"
                        :autosize="{minRows: 2, maxRows: 5}" v-model="addDataForm.formDesc"
                        placeholder="请输入"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <div slot="footer" class="dialog-footer operate-btns-bottom">
        <el-button @click="clearAddField">取 消</el-button>
        <el-button type="primary" class="ml-30" :loading="isLoading" @click="doAddField(1,'ruleFormAdd')">确 定
        </el-button>
      </div>
    </el-dialog>

    <el-dialog title="编辑属性字段" class="spl-dialog addDialog" :visible.sync="dialogFormEditVisible" center
               :closeOnClickModal="false" :before-close="clearEditField">
      <el-form :model="activeViewRow" ref="ruleFormEdit" label-width="120px" class="demo-ruleForm">
        <el-row :gutter="20">
          <el-col :span="11">
            <el-form-item label="所属分类:" required>
              <treeSelect :options="typeTreeData"
                          :value="activeViewRow.subModuleCode==null?activeViewRow.moduleCode:activeViewRow.subModuleCode" :disabled="true"></treeSelect>
            </el-form-item>
          </el-col>
          <el-col :span="13">
            <el-form-item label="是否有效:" required>
              <el-switch v-model="activeViewRow.effective" :active-value="true" :inactive-value="false"
                         :activeColor="$global.switchColor[0]" :inactiveColor="$global.switchColor[1]">
              </el-switch>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="11">
            <el-form-item label="字段名称:" prop="formName" :rules="[{ required: true, message: '请填写字段名称'}]">
              <el-input v-model="activeViewRow.formName" placeholder="请输入" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="13">
            <el-form-item label="字段类型:" prop="formTypeCode" :rules="[{ required: true, message: '请选择字段类型'}]">
              <el-select v-model="activeViewRow.formTypeCode" ref="editFormTypeCode" placeholder="请选择" :disabled="true"
                         @change="changeFormType($event,2)">
                <el-option v-for="(item,index) in formTypeList" :label="item.text" :value="item.value"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20" v-if="activeViewRow.formTypeCode==6" v-for="(item ,index) in editSelections" :key="index">
          <el-col :span="11">
            <el-form-item v-if="index==0" label="对应选项:" :rules="[{ required: true, message: '请输入选项值'}]">
              <el-input v-model="item.text" disabled="disabled"></el-input>
            </el-form-item>
            <el-form-item v-if="index!=0" label="">
              <el-input v-model="item.text" disabled="disabled"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20" v-if="activeViewRow.formTypeCode==1">
          <el-col :span="11">
            <el-form-item label="字段长度:">
              <el-input v-model="activeViewRow.maximum" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20" v-if="activeViewRow.formTypeCode==2">
          <el-col :span="11">
            <el-form-item label="默认值:">
              <el-input v-model="activeViewRow.defaultValue" :disabled="true"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20" v-if="activeViewRow.formTypeCode==8">
          <el-col :span="11">
            <el-form-item label="默认值:">
              <el-radio-group v-model="activeViewRow.defaultValue">
                <el-radio label="1" :disabled="true">是</el-radio>
                <el-radio label="0" :disabled="true">否</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="11">
            <el-form-item label="是否必填:" required>
              <el-switch v-model="activeViewRow.required" dis :active-value="true" :inactive-value="false"
                         :activeColor="$global.switchColor[0]" :inactiveColor="$global.switchColor[1]">
              </el-switch>
            </el-form-item>
          </el-col>
          <el-col :span="13">
            <el-form-item label="入职配置是否有效:" required>
              <el-switch v-model="activeViewRow.otherRequired" :active-value="'1'" :inactive-value="'0'"
                         :activeColor="$global.switchColor[0]" :inactiveColor="$global.switchColor[1]">
              </el-switch>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="字段描述:">
              <el-input type="textarea" placeholder="请输入"
                        :autosize="{minRows: 2, maxRows: 5}" v-model="activeViewRow.formDesc"></el-input>
            </el-form-item>
          </el-col>
        </el-row>

      </el-form>
      <div slot="footer" class="dialog-footer operate-btns-bottom">
        <el-button @click="clearEditField">取 消</el-button>
        <el-button type="primary" class="ml-30" :loading="editIsLoading" @click="doAddField(2,'ruleFormEdit')">确 定
        </el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
  import treeSelect from '../../components/common/treeSelect'
  import comTable from '../../components/common/table'
  import ElInput from "../../../node_modules/element-ui/packages/input/src/input";
  import ElOption from "../../../node_modules/element-ui/packages/select/src/option";
  export default {
    components: {
      ElOption,
      ElInput,
      treeSelect, comTable
    },
    data () {
      return {
        // 导航
        pathData: [
          { name: '员工信息' },
          { name: '基础设置', path: '/baseSetting' }
        ],
        activeName: 'baseInfo',
        isLoading: false,
        editIsLoading: false,
        addDataForm: {
          formName: '',
          formType: '',
          formTypeCode: '',
          required: true,
          moduleCode: '',
          moduleName: '',
          subModuleCode: null,
          subModuleName: null,
          effective: true,
          otherRequired: true,
          formDesc: '',
          isDelete:false,
          optionalValue:'',
          selections: [],
          defaultValue: '',
          maximum: ''
        },
        paneLoaded: {
          baseInfo: {moduleCode: "employee_info",moduleName: "人员基本信息"},
          workInfo: {moduleCode: "work_info",moduleName: "在职信息"},
          accountInfo: {moduleCode: "account_info",moduleName: "账户信息",subModuleCode: "bank_info",subModuleName: "银行信息"},
          contractInfo: {moduleCode: "contact_info",moduleName: "合同信息"}
        },
        dialogFormAddVisible: false,
        dialogFormEditVisible: false,
        activeViewRow: {
          formName: '',
          formType: '',
          formTypeCode: '',
          required: true,
          moduleCode: '',
          moduleName: '',
          effective: true,
          otherRequired: true,
          formDesc: '',
          optionalValue : ''
        },
        ruleFormAdd: {},
        showTypeMsg: false, // 控制什么时候显示弹框中字段类型的错误信息

        editSelections: [],
        typeTreeData: [
          /*{
            id: "education_info",
            title: '教育经历'
          },*/
          {
            id: "employee_info",
            title: '个人基本信息'
          },
          {
            id: "work_info",
            title: '在职信息'
          },
          /*{
            id: "worked_info",
            title: '教育经历'
          },*/
          {
            id: "account_info",
            title: '账户信息',
            children: [
              {
                id: "bank_info",
                title: '银行信息',
                pId:"account_info",
                pTitle:"账户信息"
              },
              {
                id: "welfare_info",
                title: '福利信息',
                pId:"account_info",
                pTitle:"账户信息"
              }
            ]
          },
          {
            id: "contact_info",
            title: "合同信息"
          }
        ],
        formTypeList:[
          {value:'1',text:'文本'},
          {value:'2',text:'数值'},
          {value:'3',text:'日期'},
          {value:'4',text:'小时分钟'},
          {value:'5',text:'时间'},
          {value:'6',text:'下拉选项'},
          {value:'7',text:'附件'},
          {value:'8',text:'是否'},
        ],
        tableHeight: this.$global.bodyHeight - 200,
        tableData: [],
        welfareTableData: []
      }
    },
    created () {
      // （个人基本信息：employee_Info,教育经历 edu_info 工作经历 worked_info 在职信息 work_info 账户信息 bank_info 合同信息 contact_info 资料信息 attach_info）
      this.getData('employee_info')
    },
    watch: {
      activeViewRow:function (newVal, oldVal) {
        if(newVal.formTypeCode == 6){
          var optionalValue = newVal.optionalValue;
          var options = []
          optionalValue.split(",").forEach(item => {
            options.push({text:item});
          })
          this.editSelections = options
        }else{
            this.editSelections = []
        }
      }
    },
    methods: {
      // 获取数据
      getData (moduleCode) {
        this.$http({
          url: '/employeeInfo/getDynamicFormSetting',
          method: 'get',
          params: {
            moduleCode: moduleCode
          }
        }).then(({data}) => {
          // （个人基本信息：employee_Info,教育经历 edu_info 工作经历 worked_info 在职信息 work_info 账户信息 bank_info 合同信息 contact_info 资料信息 attach_info）
          var rows = data.rows
          if (moduleCode === 'account_info') {
            const bankInfos = [], welfareInfos = [];
            rows.forEach(item => {
                item.dynamicFormSettingDTOs.forEach(it => {
                  if (it.subModuleCode === "bank_info") {
                    bankInfos.push(it)
                  } else {
                    welfareInfos.push(it)
                  }
                })

            })
            this.tableData = bankInfos
            this.welfareTableData = welfareInfos
            this.$refs.comTable.tableData = bankInfos
            this.$refs.welfareTable.tableData = welfareInfos
          } else {
            this.tableData = rows.length > 0 ? rows[0].dynamicFormSettingDTOs : []
            this.$refs.comTable.tableData = this.tableData
          }
        })
      },
      handleClick (tab, event) {
        this.getData(this.paneLoaded[this.activeName].moduleCode)
      },
      rowClick(row){
        this.dialogFormEditVisible = true
        this.activeViewRow = this.$global.deepcopyArray([row])[0]
      },
      formatterText(row, column, cellValue, index){
        if (cellValue==true || cellValue === '1')
          return "是"
        else
          return "否"
      },
      changeFormType(value, type){
        if (type == 1) {
          if (!value) {
            this.addDataForm.formType = "";
          } else {
            var options = this.$refs.addFormTypeCode.options
            var currentLabel = ""
            options.forEach(item => {
              if (item.value === value) {
                currentLabel = item.currentLabel
              }
            })
            this.addDataForm.formType = currentLabel
          }
          this.setdDefaultValue(value)
        } else if (type == 2) {
          if (!value) {
            this.activeViewRow.formType = "";
          } else {
            var options = this.$refs.editFormTypeCode.options
            var currentLabel = ""
            options.forEach(item => {
              if (item.value === value) {
                currentLabel = item.currentLabel
              }
            })
            this.activeViewRow.formType = currentLabel
          }
        }
      },
      setdDefaultValue(formCode){
          this.addDataForm.maximum = ''
          if(!formCode){
            this.addDataForm.selections = []
            this.addDataForm.defaultValue = ''
          }else{
            if(formCode == 6){
              this.addDataForm.selections = [{text:""}]
            }
            if(formCode !=8){
              this.addDataForm.defaultValue = ''
            }else{
              this.addDataForm.defaultValue = '1'
            }
          }

      },
      addOption(){
        this.addDataForm.selections.push({text:''})
      },
      clickSwitch(value, row){
        this.activeViewRow = row
        this.activeViewRow.effective = value
        this.toSave(2, false)
      },
      // 保存-新增字段
      doAddField (type, refName) {
        if (type == 1){
          this.isLoading = true
          var texts = [];
          this.addDataForm.selections.forEach(item => {
            texts.push(item.text)
          })
          this.addDataForm.optionalValue=texts.join(",");
        }
        else
          this.editIsLoading = true
        this.$refs[refName].validate((valid) => {
          if (!valid) {
            if (type == 1)
              this.isLoading = false
            else
              this.editIsLoading = false
          }else{
            this.toSave(type, true)
          }
        })
      },
      toSave(type, loadingFlag){
        this.$http({
          url: '/employeeInfo/saveOrUpdate/dynamicForm',
          method: 'post',
          data: type == 1 ? this.addDataForm : this.activeViewRow
        }).then(({data}) => {
          if (data.code == 0) {
            if (type == 1)
              this.clearAddField()
            else{
                if(loadingFlag){
                  this.clearEditField()
                }
            }
            this.getData(this.paneLoaded[this.activeName].moduleCode)
          } else {
            if (loadingFlag) {
              this.$message({
                message: "保存失败",
                type: 'error'
              })
            }
          }
          if (loadingFlag) {
            if (type == 1)
              this.isLoading = false
            else
              this.editIsLoading = false
          }
        })
      },
      //删除自定义
      delRow(row){
        this.$confirm('删除后该字段内容将清空', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.activeViewRow = row
          this.activeViewRow.isDelete = true
          this.toSave(2, false)
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
      },
      toAddDataForm(){
        this.dialogFormAddVisible=true
        var moduleCode = this.paneLoaded[this.activeName].moduleCode

        this.addDataForm.moduleCode = moduleCode
        this.addDataForm.moduleName = this.paneLoaded[this.activeName].moduleName
        if(moduleCode !== 'account_info'){
          this.addDataForm.subModuleCode = null
          this.addDataForm.subModuleName = null
        }else{
          this.addDataForm.subModuleCode = this.paneLoaded[this.activeName].subModuleCode
          this.addDataForm.subModuleName = this.paneLoaded[this.activeName].subModuleName
        }
      },
      //  清除并关闭--新增字段
      clearAddField (done) {
        this.addDataForm = {
          formName: '',
          formType: '',
          formTypeCode: '',
          required: true,
          moduleCode: '',
          moduleName: '',
          subModuleCode: null,
          subModuleName: null,
          effective: true,
          otherRequired: true,
          formDesc: '',
          isDelete:false,
          optionalValue:'',
          selections:[],
          defaultValue: '',
          maximum: ''
        }
        this.$refs['ruleFormAdd'].resetFields()
        if(typeof done === 'function'){
           done()
        }else{
          this.dialogFormAddVisible = false
        }
      },
      //  清除并关闭--新增字段
      clearEditField (done) {
        this.$refs['ruleFormEdit'].resetFields()
        if(typeof done === 'function'){
            done()
        }else{
          this.dialogFormEditVisible = false
        }
      },
      getNodeValue (node) {
        var pId = node.pId
        if(pId){
          this.addDataForm.moduleCode = pId
          this.addDataForm.moduleName = node.pTitle
          this.addDataForm.subModuleCode = node.id
          this.addDataForm.subModuleName = node.title
        }else{
          this.addDataForm.moduleCode = node.id
          this.addDataForm.moduleName = node.title
        }

      },
      validFormName(rule, value, callback){
        var moduleCode = this.addDataForm.moduleCode
        var subModuleCode = this.addDataForm.subModuleCode
        if(moduleCode){
          this.$http({
            url: '/employeeInfo/getDynamicFormSetting',
            method: 'get',
            params: {
              moduleCode: moduleCode
            }
          }).then(({data}) => {
            // （个人基本信息：employee_Info,教育经历 edu_info 工作经历 worked_info 在职信息 work_info 账户信息 bank_info 合同信息 contact_info 资料信息 attach_info）
            var datas = []
            var welfareInfos = []
            var rows = data.rows
            if (moduleCode === 'account_info') {
              rows.forEach(item => {
                item.dynamicFormSettingDTOs.forEach(it => {
                  if (it.subModuleCode === "bank_info") {
                    datas.push(it)
                  } else {
                    welfareInfos.push(it)
                  }
                })
              })
            } else {
              datas = rows.length > 0 ? rows[0].dynamicFormSettingDTOs : []
            }
            if (moduleCode === 'account_info' && subModuleCode !== "bank_info") {
              datas = welfareInfos
            }
            var valid = true
            datas.forEach(item => {
              if(item.formName === value){
                valid = false
                return false
              }
            })
            if(!valid){
              callback(new Error('字段名【'+value+'】已存在'))
            }else{
              callback()
            }
          })
        }
      },
      validSelectOptions (rule, value, callback){
          if(value){
            var number = 0
            this.addDataForm.selections.forEach(item => {
              if(item.text === value)
                  number++

            })
            if(number>1){
              callback(new Error('选项值【'+value+'】已存在'))
            }else{
              callback()
            }
          }

      }
    }

  }
</script>
<style lang="less">
  .emp-baseSetting-container {
    .addDialog {
      .el-dialog {
        width: 700px;
      }
      .el-form-item__label {
        width: 150px !important;
      }
      .el-form-item__content {
        margin-left: 150px !important;
      }
      .el-col:nth-child(odd) {
        .el-form-item__label {
          width: 90px !important;
        }
        .el-form-item__content {
          margin-left: 90px !important;
        }
      }
    }
    .emp-tabs .el-tabs__content {
      padding: 0;
    }
    .table-content {
      padding: 20px;
      padding-top: 0;
    }
    .add-field-btn {
      padding: 0;
      margin-top: 15px;
    }
    .pt-30 {
      padding-top: 30px !important;
    }
    .pt-10 {
      padding-top: 10px !important;
    }
    .text-red-imp {
      color: #F56C6C !important;
    }
  }
</style>
